<template>
    <div>
    <div>————————————以下是待办清单——————————————</div>
        <h3>{{msgFromChild}}</h3>
        <input v-model="text">
        <button @click="clearInput">清空</button>
        <button @click="$emit('addList',text)">提交</button>
        <button @click="$emit('removeAll')">重置清单</button>
    </div>
</template>

<script>
import { ref,onMounted } from "vue";
import bus from 'vue3-eventbus'
export default {
    props:{
        title:String
    },
    setup(){
        const msg=ref("我是子组件的值");
        const msgFromChild=ref("");
        const text=ref("");
        const clearInput = () => {
            text.value="";
        };
        onMounted(()=>{
            bus.on("getMsg",msg=>{
                console.log("触发getMsg")
                msgFromChild.value=msg;
            });
        });
        return{
            msg,
            text,
            clearInput,
            msgFromChild
        };
    }
}
</script>